<template>
  <div>
    <el-row>
      <el-col :span="18">
        <el-row style="margin-top: 20px">
          <shortcut-links/>
        </el-row>
        <el-row style="margin-top: 20px">
          <consumption :weekData="weekData" :itemData="itemData"/>
        </el-row>
      </el-col>
      <el-col :span="6">
        <userInfo style="margin-top: 20px; margin-left: 20px"/>
      </el-col>
    </el-row>

    <!--    用户端-->
    <el-row>
      <el-col :span="12">
        <userRawData/>
      </el-col>
      <el-col :span="6">
        <pie-chart-box title="昨日消费数据处理情况">
          <pie-for-yesterday></pie-for-yesterday>
        </pie-chart-box>

      </el-col>
      <el-col :span="6">
        <pie-chart-box title="挂起数据分布">
          <yesterday-distribution/>
        </pie-chart-box>
      </el-col>
    </el-row>
    <!--    用户端结束-->

    <el-row>
      <el-col :span="24">
        <div style="width: 100%; padding: 20px 0 50px 0; text-align: center">
          <span style="font-size: 14px;font-weight: 400;color: #999999;">{{'技术支持：广州羊城通有限公司  客服电话：020-88888888'}}</span>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
    import {mapGetters} from "vuex";
    import shortcutLinks from "../../../../../../../../browser/local/oracle/Saber/src/views/wel/components/shortcutLinks";
    import consumption from "./components/consumption";
    import userInfo from "../../../../../../../../browser/local/oracle/Saber/src/views/wel/components/userInfo";
    import userRawData from "../../../../../../../../browser/local/oracle/Saber/src/views/wel/components/userRawData";
    import pieForYesterday from "../../../../../../../../browser/local/oracle/Saber/src/views/wel/components/pieForYesterday";
    import pieChartBox from "../../../../../../../../browser/local/oracle/Saber/src/views/wel/components/pieChartBox";
    import yesterdayDistribution from "../../../../../../../../browser/local/oracle/Saber/src/views/wel/components/yesterdayDistribution";

    import {getList2,getList3,getList4} from "@/api/demo/dtmexpcardstoresum";

    export default {
        name: "wel",
        components: {
            pieChartBox,
            shortcutLinks,
            consumption,
            userInfo,
            userRawData,
            pieForYesterday,
            yesterdayDistribution
        },
        created() {
            this.getWeekData();
            this.getItemData();
            // getList2().then(data=>{
            //
            // })
            //
            getList4().then(data=>{
                console.log('122',data)
            })
        },
        data() {
            return {
                activeNames: ['1', '2', '3', '5'],
                logActiveNames: ['24'],
                weekData: [],
                itemData: []
            };
        },
        computed: {
            ...mapGetters(["userInfo", "colorName"]),
        },
        methods: {
            getItemData() {
                getList2().then(data=> {
                    this.itemData = data.data.data
                })
            },
            getWeekData() {
                getList3().then(data=>{
                    this.weekData = data.data.data.GetWeekData1
                })
            },
            handleChange(val) {
                window.console.log(val);
            }
        },
    };
</script>

<style lang="scss" scoped>
  .el-font-size {
    font-size: 14px;
  }

  .el-tag {
    margin-right: 20px;
  }
</style>

